<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org">
<head th:replace="common/fragment::top">

</head>

<body>
<div class="lyear-layout-web">
    <div class="lyear-layout-container">
        <!--左侧导航-->
        <div th:replace="common/fragment::leftmenu"></div>
        <!--End 左侧导航-->

        <!--头部信息-->
        <div th:replace="common/fragment::header"></div>
        <!--End 头部信息-->

        <!--页面主要内容-->
        <main class="lyear-layout-content">

            <div class="container-fluid">
                <div class="row">
                    <div class="col-lg-12">
                        <div class="card">
                            <table class="table table-bordered ">
                                <thead>
                                <tr>
                                    <th hidden="hidden">商品id</th>
                                    <th>仓库</th>
                                    <th>商品名称</th>
                                    <th>商品型号</th>
                                    <!--    <th>角色图标</th>-->
                                    <th>商品规格</th>
                                    <!--                                            <th>包装</th>-->
                                    <th>库存数量</th>
                                    <th>库存阈值</th>
                                    <!--    <th>操作</th>-->
                                </tr>
                                </thead>
                                <tbody>
                                <!--/*@thymesVar id="sellDetailVOList" type="com.examplemartin.jpademo.pojo.vo.sell.sellDetailVO"*/-->
                                <tr class="detail" th:each="detail:${repoInfoPOS}">
                                    <td class="goodid" hidden="hidden" th:text="${detail.goodPO.id}">
                                        商品id
                                    </td>
                                    <td th:text="${detail.stockPO.name}">仓库</td>
                                    <td th:text="${detail.goodPO.name}">商品名称</td>
                                    <td th:text="${detail.goodPO.spec}">商品型号</td>
                                    <!--    <th>角色图标</th>-->
                                    <td th:text="${detail.goodPO.unit}">商品规格</td>
                                    <td  class="goodcount" th:text="${detail.goodcount}">库存数量</td>
                                    <td  class="threshold" th:text="${detail.threshold}">库存阈值</td>
                                </tr>
                                </tbody>

                            </table>
                        </div>
                    </div>

                </div>

            </div>
        </main>
        <!--End 页面主要内容-->
        <!--End 页面主要内容-->
    </div>
</div>
<div th:replace="common/fragment::tail-script"></div>
<style>
    .modify {
        color: #ff5151;
        font-weight: bolder;
    }
    .hidesubtable {
        display: none;
    }
</style>

<script type="text/javascript">

    $(document).ready(function(){
// 触碰阈值, class=modify
        $('#repoInfotable tr').each(function (i, e) {
            let threshold = $(e).children('.threshold').text()

            let goodcount = $(e).children('.goodcount').text()
            console.log("threshold=" + threshold + "   goodcount=" + goodcount)
            if (parseInt(threshold) >= parseInt(goodcount)) {
                $(e).addClass('modify')
            }

        })

// 搜索
        $('#repoinfo-search-btn').click(function (ev) {
            let thresdhold = $('#thresdhold').val()
            let stockid = $('#stockid').val()
            let goodname = $('#goodname').val()
            console.log(thresdhold)
            console.log(stockid)
            console.log(goodname)
            let str = ''

            if(thresdhold!=''){
                str = '?repostatus='+thresdhold
            }

            if(str == ''){
                if(stockid!=''){
                    str = str + '?stockid='+stockid
                }
            }else{
                if(stockid!=''){
                    str = str + '&stockid='+stockid
                }
            }

            if(str == ''){
                if(goodname!=''){
                    str = str + '?likegoodname='+goodname
                }
            }else{
                if(goodname!=''){
                    str = str + '&likegoodname='+goodname
                }
            }


            window.location.href='/stock/repoinfolist.do'+str

        })
// 屏蔽 a 跳转
        $('.table-responsive a').each(function (i,e) {
                $(e).click(function (event) {
                    event.preventDefault();
                })
        })

// 手风琴各个仓库 页面加载隐藏
        $('.sellouttab').each(function (i, e) {
            $(e).addClass('hidesubtable')
        });
// END手风琴各个仓库 页面加载隐藏


// 渲染 补货
        $('.detail').each(function () {
            let goodcount = $(this).children('.goodcount').text()
            let threshold = $(this).children('.threshold').text()


            if(parseInt(goodcount)<parseInt(threshold)){
                console.log('add class modify'+$(this))
                $(this).addClass('modify')
            }
        })
// END渲染 补货

// 手风琴效果 a标签
        $('.subtabahref').each(function (i, e) {
            $(e).click(function (event) {


                $('.sellouttab').each(function (i, e) {
                    $(e).addClass('hidesubtable')
                })

                let href = $(e).attr('href')
                $('#' + href).removeClass('hidesubtable')

                event.preventDefault();
                return false;
            })
        });
// END手风琴效果 a标签

        });

</script>
</body>
</html>